<!doctype html>
<html>
 <head> 
  <meta charset="utf-8"> 
  <title>Adminox - Responsive Web App Kit</title> 
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> 
  <meta content="A fully featured admin theme which can be used to build CRM, CMS, etc." name="description"> 
  <meta content="Coderthemes" name="author"> 
  <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
  <!-- App favicon --> 
  <link rel="shortcut icon" href="assets/images/favicon.ico"> 
  <!-- DataTables --> 
  <link href="../plugins/datatables/dataTables.bootstrap4.min.css" rel="stylesheet" type="text/css"> 
  <link href="../plugins/datatables/buttons.bootstrap4.min.css" rel="stylesheet" type="text/css"> 
  <!-- Responsive datatable examples --> 
  <link href="../plugins/datatables/responsive.bootstrap4.min.css" rel="stylesheet" type="text/css"> 
  <!-- App css --> 
  <link href="assets/css/bootstrap.min.css" rel="stylesheet" type="text/css"> 
  <link href="assets/css/icons.css" rel="stylesheet" type="text/css"> 
  <link href="assets/css/metismenu.min.css" rel="stylesheet" type="text/css"> 
  <link href="assets/css/style.css" rel="stylesheet" type="text/css"> 
  <script src="assets/js/modernizr.min.js"></script> 
 </head> 
 <body> 
  <!-- Begin page --> 
  <div id="wrapper"> 
   <!-- Top Bar Start --> 
   <div class="topbar"> 
    <!-- LOGO --> 
    <div class="topbar-left"> 
     <a href="index1.html" class="logo"> <span> <img src="assets/images/logo.png" alt="" height="25"> </span> <i> <img src="assets/images/logo_sm.png" alt="" height="28"> </i> </a>
    </div> 
    <nav class="navbar-custom"> 
     <ul class="list-inline float-right mb-0"> 
      <li class="list-inline-item dropdown notification-list"> <a class="nav-link dropdown-toggle arrow-none waves-light waves-effect" data-toggle="dropdown" href="#" role="button" aria-haspopup="false" aria-expanded="false"> <i class="dripicons-bell noti-icon"></i> <span class="badge badge-pink noti-icon-badge">4</span> </a> 
       <div class="dropdown-menu dropdown-menu-right dropdown-arrow dropdown-lg" aria-labelledby="Preview"> 
        <!-- item--> 
        <div class="dropdown-item noti-title"> 
         <h5><span class="badge badge-danger float-right">5</span>Notification</h5> 
        </div> 
        <!-- item--> 
        <a href="javascript:void(0);" class="dropdown-item notify-item"> 
         <div class="notify-icon bg-success">
          <i class="icon-bubble"></i>
         </div> <p class="notify-details">Robert S. Taylor commented on Admin<small class="text-muted">1 min ago</small></p> </a> 
        <!-- item--> 
        <a href="javascript:void(0);" class="dropdown-item notify-item"> 
         <div class="notify-icon bg-info">
          <i class="icon-user"></i>
         </div> <p class="notify-details">New user registered.<small class="text-muted">1 min ago</small></p> </a> 
        <!-- item--> 
        <a href="javascript:void(0);" class="dropdown-item notify-item"> 
         <div class="notify-icon bg-danger">
          <i class="icon-like"></i>
         </div> <p class="notify-details">Carlos Crouch liked <b>Admin</b><small class="text-muted">1 min ago</small></p> </a> 
        <!-- All--> 
        <a href="javascript:void(0);" class="dropdown-item notify-item notify-all"> View All </a> 
       </div> </li> 
      <li class="list-inline-item dropdown notification-list"> <a class="nav-link dropdown-toggle waves-effect waves-light nav-user" data-toggle="dropdown" href="#" role="button" aria-haspopup="false" aria-expanded="false"> <img src="assets/images/users/avatar-1.jpg" alt="user" class="rounded-circle"> </a> 
       <div class="dropdown-menu dropdown-menu-right profile-dropdown " aria-labelledby="Preview"> 
        <!-- item--> 
        <div class="dropdown-item noti-title"> 
         <h5 class="text-overflow"><small>Welcome ! John</small> </h5> 
        </div> 
        <!-- item--> 
        <a href="javascript:void(0);" class="dropdown-item notify-item"> <i class="zmdi zmdi-account-circle"></i> <span>Profile</span> </a> 
        <!-- item--> 
        <a href="javascript:void(0);" class="dropdown-item notify-item"> <i class="zmdi zmdi-settings"></i> <span>Settings</span> </a> 
        <!-- item--> 
        <a href="javascript:void(0);" class="dropdown-item notify-item"> <i class="zmdi zmdi-lock-open"></i> <span>Lock Screen</span> </a> 
        <!-- item--> 
        <a href="javascript:void(0);" class="dropdown-item notify-item"> <i class="zmdi zmdi-power"></i> <span>Logout</span> </a> 
       </div> </li> 
     </ul> 
     <ul class="list-inline menu-left mb-0"> 
      <li class="float-left"> <button class="button-menu-mobile open-left waves-light waves-effect"> <i class="dripicons-menu"></i> </button> </li> 
      <li class="hide-phone app-search"> 
       <form role="search" class=""> 
        <input type="text" placeholder="Search..." class="form-control"> 
        <a href=""><i class="fa fa-search"></i></a> 
       </form> </li> 
     </ul> 
    </nav> 
   </div> 
   <!-- Top Bar End --> 
   <!-- ========== Left Sidebar Start ========== --> 
   <div class="left side-menu"> 
    <div class="slimscroll-menu" id="remove-scroll"> 
     <!-- Sidemenu --> 
     <div id="sidebar-menu"> 
      <!-- Left Menu Start --> 
      <ul class="metismenu" id="side-menu"> 
       <li class="menu-title">Navigation</li> 
       <li> <a href="javascript: void(0);"> <i class="fi-air-play"></i><span class="badge badge-success pull-right">2</span> <span> Dashboard </span> </a> 
        <ul class="nav-second-level" aria-expanded="false"> 
         <li><a href="index1.html">Dashboard 1</a></li>
         <li><a href="dashboard-2.html">Dashboard 2</a></li> 
        </ul> </li> 
       <li> <a href="javascript: void(0);"><i class="fi-target"></i> <span> Admin UI </span> <span class="menu-arrow"></span></a> 
        <ul class="nav-second-level" aria-expanded="false"> 
         <li><a href="admin-grid.html">Grid</a></li> 
         <li><a href="admin-sweet-alert.html">Sweet Alert</a></li> 
         <li><a href="admin-tiles.html">Tiles Box</a></li> 
         <li><a href="admin-nestable.html">Nestable List</a></li> 
         <li><a href="admin-rangeslider.html">Range Slider</a></li> 
         <li><a href="admin-ratings.html">Ratings</a></li> 
         <li><a href="admin-filemanager.html">File Manager</a></li> 
         <li><a href="admin-lightbox.html">Lightbox</a></li> 
         <li><a href="admin-scrollbar.html">Scroll bar</a></li> 
         <li><a href="admin-slider.html">Slider</a></li> 
         <li><a href="admin-treeview.html">Treeview</a></li> 
        </ul> </li> 
       <li> <a href="javascript: void(0);"><i class="fi-briefcase"></i> <span> UI Kit </span> <span class="menu-arrow"></span></a> 
        <ul class="nav-second-level" aria-expanded="false"> 
         <li><a href="ui-typography.html">Typography</a></li> 
         <li><a href="ui-panels.html">Panels</a></li> 
         <li><a href="ui-buttons.html">Buttons</a></li> 
         <li><a href="ui-modals.html">Modals</a></li> 
         <li><a href="ui-checkbox-radio.html">Checkboxs-Radios</a></li> 
         <li><a href="ui-spinners.html">Spinners</a></li> 
         <li><a href="ui-ribbons.html">Ribbons</a></li> 
         <li><a href="ui-portlets.html">Portlets</a></li> 
         <li><a href="ui-tabs.html">Tabs</a></li> 
         <li><a href="ui-progressbars.html">Progress Bars</a></li> 
         <li><a href="ui-notifications.html">Notification</a></li> 
         <li><a href="ui-carousel.html">Carousel</a> </li>
         <li><a href="ui-video.html">Video</a> </li>
         <li><a href="ui-tooltips-popovers.html">Tooltips &amp; Popovers</a></li> 
         <li><a href="ui-images.html">Images</a></li> 
         <li><a href="ui-bootstrap.html">Bootstrap UI</a></li> 
        </ul> </li> 
       <li> <a href="tickets.html"><i class="fi-help"></i><span class="badge badge-danger pull-right">New</span> <span> Tickets </span></a> </li> 
       <li> <a href="javascript: void(0);"><i class="fi-box"></i><span> Icons </span> <span class="menu-arrow"></span></a> 
        <ul class="nav-second-level" aria-expanded="false"> 
         <li><a href="icons-colored.html">Colored Icons</a></li> 
         <li><a href="icons-materialdesign.html">Material Design</a></li> 
         <li><a href="icons-dripicons.html">Dripicons</a></li> 
         <li><a href="icons-fontawesome.html">Font awesome</a></li> 
         <li><a href="icons-feather.html">Feather Icons</a></li> 
         <li><a href="icons-simple-line.html">Simple line Icons</a></li> 
         <li><a href="icons-flags.html">Flag Icons</a></li> 
         <li><a href="icons-file.html">File Icons</a></li> 
         <li><a href="icons-pe7.html">PE7 Icons</a></li> 
         <li><a href="icons-typicons.html">Typicons</a></li> 
        </ul> </li> 
       <li> <a href="javascript: void(0);"><i class="fi-bar-graph-2"></i><span> Graphs </span> <span class="menu-arrow"></span></a> 
        <ul class="nav-second-level" aria-expanded="false"> 
         <li><a href="chart-flot.html">Flot Chart</a></li> 
         <li><a href="chart-morris.html">Morris Chart</a></li> 
         <li><a href="chart-google.html">Google Chart</a></li> 
         <li><a href="chart-echart.html">Echarts</a></li> 
         <li><a href="chart-chartist.html">Chartist Charts</a></li> 
         <li><a href="chart-chartjs.html">Chartjs Chart</a></li> 
         <li><a href="chart-c3.html">C3 Chart</a></li> 
         <li><a href="chart-justgage.html">Justgage Charts</a></li> 
         <li><a href="chart-sparkline.html">Sparkline Chart</a></li> 
         <li><a href="chart-knob.html">Jquery Knob</a></li> 
        </ul> </li> 
       <li> <a href="javascript: void(0);"><i class="fi-mail"></i><span> Email </span> <span class="menu-arrow"></span></a> 
        <ul class="nav-second-level" aria-expanded="false"> 
         <li><a href="email-inbox.html">Inbox</a></li> 
         <li><a href="email-read.html">Read Email</a></li> 
         <li><a href="email-compose.html">Compose Email</a></li> 
        </ul> </li> 
       <li> <a href="taskboard.html"><i class="fi-paper"></i> <span> Task Board </span></a> </li> 
       <li> <a href="javascript: void(0);"><i class="fi-disc"></i><span class="badge badge-warning pull-right">12</span> <span> Forms </span></a> 
        <ul class="nav-second-level" aria-expanded="false"> 
         <li><a href="form-elements.html">Form Elements</a></li> 
         <li><a href="form-advanced.html">Form Advanced</a></li> 
         <li><a href="form-layouts.html">Form Layouts</a></li> 
         <li><a href="form-validation.html">Form Validation</a></li> 
         <li><a href="form-pickers.html">Form Pickers</a></li> 
         <li><a href="form-wizard.html">Form Wizard</a></li> 
         <li><a href="form-mask.html">Form Masks</a></li> 
         <li><a href="form-summernote.html">Summernote</a></li> 
         <li><a href="form-wysiwig.html">Wysiwig Editors</a></li> 
         <li><a href="form-typeahead.html">Typeahead</a></li> 
         <li><a href="form-x-editable.html">X Editable</a></li> 
         <li><a href="form-uploads.html">Multiple File Upload</a></li> 
        </ul> </li> 
       <li> <a href="javascript: void(0);"><i class="fi-layout"></i> <span> Tables </span> <span class="menu-arrow"></span></a> 
        <ul class="nav-second-level" aria-expanded="false"> 
         <li><a href="tables-basic.html">Basic Tables</a></li> 
         <li><a href="tables-layouts.html">Tables Layouts</a></li> 
         <li><a href="tables-datatable.html">Data Tables</a></li> 
         <li><a href="tables-foo-tables.html">Foo Tables</a></li> 
         <li><a href="tables-responsive.html">Responsive Table</a></li> 
         <li><a href="tables-tablesaw.html">Tablesaw Tables</a></li> 
         <li><a href="tables-editable.html">Editable Tables</a></li> 
        </ul> </li> 
       <li class="menu-title">More</li> 
       <li> <a href="javascript: void(0);"><i class="fi-map"></i> <span> Maps </span> <span class="menu-arrow"></span></a> 
        <ul class="nav-second-level" aria-expanded="false"> 
         <li><a href="maps-google.html">Google Maps</a></li> 
         <li><a href="maps-google-full.html">Full Google Map</a></li> 
         <li><a href="maps-vector.html">Vector Maps</a></li> 
         <li><a href="maps-mapael.html">Mapael Maps</a></li> 
        </ul> </li> 
       <li><a href="calendar.html"><i class="fi-clock"></i> <span>Calendar</span> </a></li> 
       <li> <a href="javascript: void(0);"><i class="fi-paper-stack"></i><span> Pages </span> <span class="menu-arrow"></span></a> 
        <ul class="nav-second-level" aria-expanded="false"> 
         <li><a href="page-starter.html">Starter Page</a></li> 
         <li><a href="page-login.html">Login</a></li> 
         <li><a href="page-register.html">Register</a></li> 
         <li><a href="page-logout.html">Logout</a></li> 
         <li><a href="page-recoverpw.html">Recover Password</a></li> 
         <li><a href="page-lock-screen.html">Lock Screen</a></li> 
         <li><a href="page-confirm-mail.html">Confirm Mail</a></li> 
         <li><a href="page-404.html">Error 404</a></li> 
         <li><a href="page-404-alt.html">Error 404-alt</a></li> 
         <li><a href="page-500.html">Error 500</a></li> 
        </ul> </li> 
       <li class="has_sub"> <a href="javascript:void(0);"><i class="fi-marquee-plus"></i><span> Extra Pages </span> <span class="menu-arrow"></span></a> 
        <ul class="nav-second-level" aria-expanded="false"> 
         <li><a href="extras-about.html">About Us</a></li> 
         <li><a href="extras-contact.html">Contact</a></li> 
         <li><a href="extras-companies.html">Companies</a></li> 
         <li><a href="extras-members.html">Members</a></li> 
         <li><a href="extras-members-2.html">Membars 2</a></li> 
         <li><a href="extras-timeline.html">Timeline</a></li> 
         <li><a href="extras-invoice.html">Invoice</a></li> 
         <li><a href="extras-maintenance.html">Maintenance</a></li> 
         <li><a href="extras-coming-soon.html">Coming Soon</a></li> 
         <li><a href="extras-faq.html">FAQ</a></li> 
         <li><a href="extras-pricing.html">Pricing</a></li> 
         <li><a href="extras-profile.html">Profile</a></li> 
         <li><a href="extras-email-template.html">Email Templates</a></li> 
         <li><a href="extras-search-result.html">Search Results</a></li> 
         <li><a href="extras-sitemap.html">Site Map</a></li> 
        </ul> </li> 
       <li> <a href="todo.html"><i class="fi-layers"></i> <span> Todo </span></a> </li> 
      </ul> 
     </div> 
     <!-- Sidebar --> 
     <div class="clearfix"></div> 
    </div> 
    <!-- Sidebar -left --> 
   </div> 
   <!-- Left Sidebar End --> 
   <!-- ============================================================== --> 
   <!-- Start right Content here --> 
   <!-- ============================================================== --> 
   <div class="content-page"> 
    <!-- Start content --> 
    <div class="content"> 
     <div class="container-fluid"> 
      <div class="row"> 
       <div class="col-12"> 
        <div class="page-title-box"> 
         <h4 class="page-title float-left">Datatable</h4> 
         <ol class="breadcrumb float-right"> 
          <li class="breadcrumb-item"><a href="#">Adminox</a></li> 
          <li class="breadcrumb-item"><a href="#">Tables</a></li> 
          <li class="breadcrumb-item active">Datatable</li> 
         </ol> 
         <div class="clearfix"></div> 
        </div> 
       </div> 
      </div> 
      <!-- end row --> 
      <div class="row"> 
       <div class="col-12"> 
        <div class="card-box table-responsive"> 
         <h4 class="m-t-0 header-title"><b>Default Example</b></h4> 
         <p class="text-muted font-13 m-b-30"> DataTables has most features enabled by default, so all you need to do to use it with your own tables is to call the construction function: <code>$().DataTable();</code>. </p> 
         <table id="datatable" class="table table-bordered"> 
          <thead> 
           <tr> 
            <th>Name</th> 
            <th>Position</th> 
            <th>Office</th> 
            <th>Age</th> 
            <th>Start date</th> 
            <th>Salary</th> 
           </tr> 
          </thead> 
          <tbody> 
           <tr> 
            <td>Tiger Nixon</td> 
            <td>System Architect</td> 
            <td>Edinburgh</td> 
            <td>61</td> 
            <td>2011/04/25</td> 
            <td>$320,800</td> 
           </tr> 
           <tr> 
            <td>Garrett Winters</td> 
            <td>Accountant</td> 
            <td>Tokyo</td> 
            <td>63</td> 
            <td>2011/07/25</td> 
            <td>$170,750</td> 
           </tr> 
           <tr> 
            <td>Ashton Cox</td> 
            <td>Junior Technical Author</td> 
            <td>San Francisco</td> 
            <td>66</td> 
            <td>2009/01/12</td> 
            <td>$86,000</td> 
           </tr> 
           <tr> 
            <td>Cedric Kelly</td> 
            <td>Senior Javascript Developer</td> 
            <td>Edinburgh</td> 
            <td>22</td> 
            <td>2012/03/29</td> 
            <td>$433,060</td> 
           </tr> 
           <tr> 
            <td>Airi Satou</td> 
            <td>Accountant</td> 
            <td>Tokyo</td> 
            <td>33</td> 
            <td>2008/11/28</td> 
            <td>$162,700</td> 
           </tr> 
           <tr> 
            <td>Brielle Williamson</td> 
            <td>Integration Specialist</td> 
            <td>New York</td> 
            <td>61</td> 
            <td>2012/12/02</td> 
            <td>$372,000</td> 
           </tr> 
           <tr> 
            <td>Herrod Chandler</td> 
            <td>Sales Assistant</td> 
            <td>San Francisco</td> 
            <td>59</td> 
            <td>2012/08/06</td> 
            <td>$137,500</td> 
           </tr> 
           <tr> 
            <td>Rhona Davidson</td> 
            <td>Integration Specialist</td> 
            <td>Tokyo</td> 
            <td>55</td> 
            <td>2010/10/14</td> 
            <td>$327,900</td> 
           </tr> 
           <tr> 
            <td>Colleen Hurst</td> 
            <td>Javascript Developer</td> 
            <td>San Francisco</td> 
            <td>39</td> 
            <td>2009/09/15</td> 
            <td>$205,500</td> 
           </tr> 
           <tr> 
            <td>Sonya Frost</td> 
            <td>Software Engineer</td> 
            <td>Edinburgh</td> 
            <td>23</td> 
            <td>2008/12/13</td> 
            <td>$103,600</td> 
           </tr> 
           <tr> 
            <td>Jena Gaines</td> 
            <td>Office Manager</td> 
            <td>London</td> 
            <td>30</td> 
            <td>2008/12/19</td> 
            <td>$90,560</td> 
           </tr> 
           <tr> 
            <td>Quinn Flynn</td> 
            <td>Support Lead</td> 
            <td>Edinburgh</td> 
            <td>22</td> 
            <td>2013/03/03</td> 
            <td>$342,000</td> 
           </tr> 
           <tr> 
            <td>Charde Marshall</td> 
            <td>Regional Director</td> 
            <td>San Francisco</td> 
            <td>36</td> 
            <td>2008/10/16</td> 
            <td>$470,600</td> 
           </tr> 
           <tr> 
            <td>Haley Kennedy</td> 
            <td>Senior Marketing Designer</td> 
            <td>London</td> 
            <td>43</td> 
            <td>2012/12/18</td> 
            <td>$313,500</td> 
           </tr> 
           <tr> 
            <td>Tatyana Fitzpatrick</td> 
            <td>Regional Director</td> 
            <td>London</td> 
            <td>19</td> 
            <td>2010/03/17</td> 
            <td>$385,750</td> 
           </tr> 
           <tr> 
            <td>Michael Silva</td> 
            <td>Marketing Designer</td> 
            <td>London</td> 
            <td>66</td> 
            <td>2012/11/27</td> 
            <td>$198,500</td> 
           </tr> 
           <tr> 
            <td>Paul Byrd</td> 
            <td>Chief Financial Officer (CFO)</td> 
            <td>New York</td> 
            <td>64</td> 
            <td>2010/06/09</td> 
            <td>$725,000</td> 
           </tr> 
           <tr> 
            <td>Gloria Little</td> 
            <td>Systems Administrator</td> 
            <td>New York</td> 
            <td>59</td> 
            <td>2009/04/10</td> 
            <td>$237,500</td> 
           </tr> 
           <tr> 
            <td>Bradley Greer</td> 
            <td>Software Engineer</td> 
            <td>London</td> 
            <td>41</td> 
            <td>2012/10/13</td> 
            <td>$132,000</td> 
           </tr> 
           <tr> 
            <td>Dai Rios</td> 
            <td>Personnel Lead</td> 
            <td>Edinburgh</td> 
            <td>35</td> 
            <td>2012/09/26</td> 
            <td>$217,500</td> 
           </tr> 
           <tr> 
            <td>Jenette Caldwell</td> 
            <td>Development Lead</td> 
            <td>New York</td> 
            <td>30</td> 
            <td>2011/09/03</td> 
            <td>$345,000</td> 
           </tr> 
           <tr> 
            <td>Yuri Berry</td> 
            <td>Chief Marketing Officer (CMO)</td> 
            <td>New York</td> 
            <td>40</td> 
            <td>2009/06/25</td> 
            <td>$675,000</td> 
           </tr> 
           <tr> 
            <td>Caesar Vance</td> 
            <td>Pre-Sales Support</td> 
            <td>New York</td> 
            <td>21</td> 
            <td>2011/12/12</td> 
            <td>$106,450</td> 
           </tr> 
           <tr> 
            <td>Doris Wilder</td> 
            <td>Sales Assistant</td> 
            <td>Sidney</td> 
            <td>23</td> 
            <td>2010/09/20</td> 
            <td>$85,600</td> 
           </tr> 
           <tr> 
            <td>Angelica Ramos</td> 
            <td>Chief Executive Officer (CEO)</td> 
            <td>London</td> 
            <td>47</td> 
            <td>2009/10/09</td> 
            <td>$1,200,000</td> 
           </tr> 
           <tr> 
            <td>Gavin Joyce</td> 
            <td>Developer</td> 
            <td>Edinburgh</td> 
            <td>42</td> 
            <td>2010/12/22</td> 
            <td>$92,575</td> 
           </tr> 
           <tr> 
            <td>Jennifer Chang</td> 
            <td>Regional Director</td> 
            <td>Singapore</td> 
            <td>28</td> 
            <td>2010/11/14</td> 
            <td>$357,650</td> 
           </tr> 
           <tr> 
            <td>Brenden Wagner</td> 
            <td>Software Engineer</td> 
            <td>San Francisco</td> 
            <td>28</td> 
            <td>2011/06/07</td> 
            <td>$206,850</td> 
           </tr> 
           <tr> 
            <td>Fiona Green</td> 
            <td>Chief Operating Officer (COO)</td> 
            <td>San Francisco</td> 
            <td>48</td> 
            <td>2010/03/11</td> 
            <td>$850,000</td> 
           </tr> 
           <tr> 
            <td>Shou Itou</td> 
            <td>Regional Marketing</td> 
            <td>Tokyo</td> 
            <td>20</td> 
            <td>2011/08/14</td> 
            <td>$163,000</td> 
           </tr> 
           <tr> 
            <td>Michelle House</td> 
            <td>Integration Specialist</td> 
            <td>Sidney</td> 
            <td>37</td> 
            <td>2011/06/02</td> 
            <td>$95,400</td> 
           </tr> 
           <tr> 
            <td>Suki Burks</td> 
            <td>Developer</td> 
            <td>London</td> 
            <td>53</td> 
            <td>2009/10/22</td> 
            <td>$114,500</td> 
           </tr> 
           <tr> 
            <td>Prescott Bartlett</td> 
            <td>Technical Author</td> 
            <td>London</td> 
            <td>27</td> 
            <td>2011/05/07</td> 
            <td>$145,000</td> 
           </tr> 
           <tr> 
            <td>Gavin Cortez</td> 
            <td>Team Leader</td> 
            <td>San Francisco</td> 
            <td>22</td> 
            <td>2008/10/26</td> 
            <td>$235,500</td> 
           </tr> 
           <tr> 
            <td>Martena Mccray</td> 
            <td>Post-Sales support</td> 
            <td>Edinburgh</td> 
            <td>46</td> 
            <td>2011/03/09</td> 
            <td>$324,050</td> 
           </tr> 
           <tr> 
            <td>Unity Butler</td> 
            <td>Marketing Designer</td> 
            <td>San Francisco</td> 
            <td>47</td> 
            <td>2009/12/09</td> 
            <td>$85,675</td> 
           </tr> 
           <tr> 
            <td>Howard Hatfield</td> 
            <td>Office Manager</td> 
            <td>San Francisco</td> 
            <td>51</td> 
            <td>2008/12/16</td> 
            <td>$164,500</td> 
           </tr> 
           <tr> 
            <td>Hope Fuentes</td> 
            <td>Secretary</td> 
            <td>San Francisco</td> 
            <td>41</td> 
            <td>2010/02/12</td> 
            <td>$109,850</td> 
           </tr> 
           <tr> 
            <td>Vivian Harrell</td> 
            <td>Financial Controller</td> 
            <td>San Francisco</td> 
            <td>62</td> 
            <td>2009/02/14</td> 
            <td>$452,500</td> 
           </tr> 
           <tr> 
            <td>Timothy Mooney</td> 
            <td>Office Manager</td> 
            <td>London</td> 
            <td>37</td> 
            <td>2008/12/11</td> 
            <td>$136,200</td> 
           </tr> 
           <tr> 
            <td>Jackson Bradshaw</td> 
            <td>Director</td> 
            <td>New York</td> 
            <td>65</td> 
            <td>2008/09/26</td> 
            <td>$645,750</td> 
           </tr> 
           <tr> 
            <td>Olivia Liang</td> 
            <td>Support Engineer</td> 
            <td>Singapore</td> 
            <td>64</td> 
            <td>2011/02/03</td> 
            <td>$234,500</td> 
           </tr> 
           <tr> 
            <td>Bruno Nash</td> 
            <td>Software Engineer</td> 
            <td>London</td> 
            <td>38</td> 
            <td>2011/05/03</td> 
            <td>$163,500</td> 
           </tr> 
           <tr> 
            <td>Sakura Yamamoto</td> 
            <td>Support Engineer</td> 
            <td>Tokyo</td> 
            <td>37</td> 
            <td>2009/08/19</td> 
            <td>$139,575</td> 
           </tr> 
           <tr> 
            <td>Thor Walton</td> 
            <td>Developer</td> 
            <td>New York</td> 
            <td>61</td> 
            <td>2013/08/11</td> 
            <td>$98,540</td> 
           </tr> 
           <tr> 
            <td>Finn Camacho</td> 
            <td>Support Engineer</td> 
            <td>San Francisco</td> 
            <td>47</td> 
            <td>2009/07/07</td> 
            <td>$87,500</td> 
           </tr> 
           <tr> 
            <td>Serge Baldwin</td> 
            <td>Data Coordinator</td> 
            <td>Singapore</td> 
            <td>64</td> 
            <td>2012/04/09</td> 
            <td>$138,575</td> 
           </tr> 
           <tr> 
            <td>Zenaida Frank</td> 
            <td>Software Engineer</td> 
            <td>New York</td> 
            <td>63</td> 
            <td>2010/01/04</td> 
            <td>$125,250</td> 
           </tr> 
           <tr> 
            <td>Zorita Serrano</td> 
            <td>Software Engineer</td> 
            <td>San Francisco</td> 
            <td>56</td> 
            <td>2012/06/01</td> 
            <td>$115,000</td> 
           </tr> 
           <tr> 
            <td>Jennifer Acosta</td> 
            <td>Junior Javascript Developer</td> 
            <td>Edinburgh</td> 
            <td>43</td> 
            <td>2013/02/01</td> 
            <td>$75,650</td> 
           </tr> 
           <tr> 
            <td>Cara Stevens</td> 
            <td>Sales Assistant</td> 
            <td>New York</td> 
            <td>46</td> 
            <td>2011/12/06</td> 
            <td>$145,600</td> 
           </tr> 
           <tr> 
            <td>Hermione Butler</td> 
            <td>Regional Director</td> 
            <td>London</td> 
            <td>47</td> 
            <td>2011/03/21</td> 
            <td>$356,250</td> 
           </tr> 
           <tr> 
            <td>Lael Greer</td> 
            <td>Systems Administrator</td> 
            <td>London</td> 
            <td>21</td> 
            <td>2009/02/27</td> 
            <td>$103,500</td> 
           </tr> 
           <tr> 
            <td>Jonas Alexander</td> 
            <td>Developer</td> 
            <td>San Francisco</td> 
            <td>30</td> 
            <td>2010/07/14</td> 
            <td>$86,500</td> 
           </tr> 
           <tr> 
            <td>Shad Decker</td> 
            <td>Regional Director</td> 
            <td>Edinburgh</td> 
            <td>51</td> 
            <td>2008/11/13</td> 
            <td>$183,000</td> 
           </tr> 
           <tr> 
            <td>Michael Bruce</td> 
            <td>Javascript Developer</td> 
            <td>Singapore</td> 
            <td>29</td> 
            <td>2011/06/27</td> 
            <td>$183,000</td> 
           </tr> 
           <tr> 
            <td>Donna Snider</td> 
            <td>Customer Support</td> 
            <td>New York</td> 
            <td>27</td> 
            <td>2011/01/25</td> 
            <td>$112,000</td> 
           </tr> 
          </tbody> 
         </table> 
        </div> 
       </div> 
      </div> 
      <!-- end row --> 
      <div class="row"> 
       <div class="col-12"> 
        <div class="card-box table-responsive"> 
         <h4 class="m-t-0 header-title"><b>Buttons example</b></h4> 
         <p class="text-muted font-13 m-b-30"> The Buttons extension for DataTables provides a common set of options, API methods and styling to display buttons on a page that will interact with a DataTable. The core library provides the based framework upon which plug-ins can built. </p> 
         <table id="datatable-buttons" class="table table-striped table-bordered" cellspacing="0" width="100%"> 
          <thead> 
           <tr> 
            <th>Name</th> 
            <th>Position</th> 
            <th>Office</th> 
            <th>Age</th> 
            <th>Start date</th> 
            <th>Salary</th> 
           </tr> 
          </thead> 
          <tbody> 
           <tr> 
            <td>Tiger Nixon</td> 
            <td>System Architect</td> 
            <td>Edinburgh</td> 
            <td>61</td> 
            <td>2011/04/25</td> 
            <td>$320,800</td> 
           </tr> 
           <tr> 
            <td>Garrett Winters</td> 
            <td>Accountant</td> 
            <td>Tokyo</td> 
            <td>63</td> 
            <td>2011/07/25</td> 
            <td>$170,750</td> 
           </tr> 
           <tr> 
            <td>Ashton Cox</td> 
            <td>Junior Technical Author</td> 
            <td>San Francisco</td> 
            <td>66</td> 
            <td>2009/01/12</td> 
            <td>$86,000</td> 
           </tr> 
           <tr> 
            <td>Cedric Kelly</td> 
            <td>Senior Javascript Developer</td> 
            <td>Edinburgh</td> 
            <td>22</td> 
            <td>2012/03/29</td> 
            <td>$433,060</td> 
           </tr> 
           <tr> 
            <td>Airi Satou</td> 
            <td>Accountant</td> 
            <td>Tokyo</td> 
            <td>33</td> 
            <td>2008/11/28</td> 
            <td>$162,700</td> 
           </tr> 
           <tr> 
            <td>Brielle Williamson</td> 
            <td>Integration Specialist</td> 
            <td>New York</td> 
            <td>61</td> 
            <td>2012/12/02</td> 
            <td>$372,000</td> 
           </tr> 
           <tr> 
            <td>Herrod Chandler</td> 
            <td>Sales Assistant</td> 
            <td>San Francisco</td> 
            <td>59</td> 
            <td>2012/08/06</td> 
            <td>$137,500</td> 
           </tr> 
           <tr> 
            <td>Rhona Davidson</td> 
            <td>Integration Specialist</td> 
            <td>Tokyo</td> 
            <td>55</td> 
            <td>2010/10/14</td> 
            <td>$327,900</td> 
           </tr> 
           <tr> 
            <td>Colleen Hurst</td> 
            <td>Javascript Developer</td> 
            <td>San Francisco</td> 
            <td>39</td> 
            <td>2009/09/15</td> 
            <td>$205,500</td> 
           </tr> 
           <tr> 
            <td>Sonya Frost</td> 
            <td>Software Engineer</td> 
            <td>Edinburgh</td> 
            <td>23</td> 
            <td>2008/12/13</td> 
            <td>$103,600</td> 
           </tr> 
           <tr> 
            <td>Jena Gaines</td> 
            <td>Office Manager</td> 
            <td>London</td> 
            <td>30</td> 
            <td>2008/12/19</td> 
            <td>$90,560</td> 
           </tr> 
           <tr> 
            <td>Quinn Flynn</td> 
            <td>Support Lead</td> 
            <td>Edinburgh</td> 
            <td>22</td> 
            <td>2013/03/03</td> 
            <td>$342,000</td> 
           </tr> 
           <tr> 
            <td>Charde Marshall</td> 
            <td>Regional Director</td> 
            <td>San Francisco</td> 
            <td>36</td> 
            <td>2008/10/16</td> 
            <td>$470,600</td> 
           </tr> 
           <tr> 
            <td>Haley Kennedy</td> 
            <td>Senior Marketing Designer</td> 
            <td>London</td> 
            <td>43</td> 
            <td>2012/12/18</td> 
            <td>$313,500</td> 
           </tr> 
           <tr> 
            <td>Tatyana Fitzpatrick</td> 
            <td>Regional Director</td> 
            <td>London</td> 
            <td>19</td> 
            <td>2010/03/17</td> 
            <td>$385,750</td> 
           </tr> 
           <tr> 
            <td>Michael Silva</td> 
            <td>Marketing Designer</td> 
            <td>London</td> 
            <td>66</td> 
            <td>2012/11/27</td> 
            <td>$198,500</td> 
           </tr> 
           <tr> 
            <td>Paul Byrd</td> 
            <td>Chief Financial Officer (CFO)</td> 
            <td>New York</td> 
            <td>64</td> 
            <td>2010/06/09</td> 
            <td>$725,000</td> 
           </tr> 
           <tr> 
            <td>Gloria Little</td> 
            <td>Systems Administrator</td> 
            <td>New York</td> 
            <td>59</td> 
            <td>2009/04/10</td> 
            <td>$237,500</td> 
           </tr> 
           <tr> 
            <td>Bradley Greer</td> 
            <td>Software Engineer</td> 
            <td>London</td> 
            <td>41</td> 
            <td>2012/10/13</td> 
            <td>$132,000</td> 
           </tr> 
           <tr> 
            <td>Dai Rios</td> 
            <td>Personnel Lead</td> 
            <td>Edinburgh</td> 
            <td>35</td> 
            <td>2012/09/26</td> 
            <td>$217,500</td> 
           </tr> 
           <tr> 
            <td>Jenette Caldwell</td> 
            <td>Development Lead</td> 
            <td>New York</td> 
            <td>30</td> 
            <td>2011/09/03</td> 
            <td>$345,000</td> 
           </tr> 
           <tr> 
            <td>Yuri Berry</td> 
            <td>Chief Marketing Officer (CMO)</td> 
            <td>New York</td> 
            <td>40</td> 
            <td>2009/06/25</td> 
            <td>$675,000</td> 
           </tr> 
           <tr> 
            <td>Caesar Vance</td> 
            <td>Pre-Sales Support</td> 
            <td>New York</td> 
            <td>21</td> 
            <td>2011/12/12</td> 
            <td>$106,450</td> 
           </tr> 
           <tr> 
            <td>Doris Wilder</td> 
            <td>Sales Assistant</td> 
            <td>Sidney</td> 
            <td>23</td> 
            <td>2010/09/20</td> 
            <td>$85,600</td> 
           </tr> 
           <tr> 
            <td>Angelica Ramos</td> 
            <td>Chief Executive Officer (CEO)</td> 
            <td>London</td> 
            <td>47</td> 
            <td>2009/10/09</td> 
            <td>$1,200,000</td> 
           </tr> 
           <tr> 
            <td>Gavin Joyce</td> 
            <td>Developer</td> 
            <td>Edinburgh</td> 
            <td>42</td> 
            <td>2010/12/22</td> 
            <td>$92,575</td> 
           </tr> 
           <tr> 
            <td>Jennifer Chang</td> 
            <td>Regional Director</td> 
            <td>Singapore</td> 
            <td>28</td> 
            <td>2010/11/14</td> 
            <td>$357,650</td> 
           </tr> 
           <tr> 
            <td>Brenden Wagner</td> 
            <td>Software Engineer</td> 
            <td>San Francisco</td> 
            <td>28</td> 
            <td>2011/06/07</td> 
            <td>$206,850</td> 
           </tr> 
           <tr> 
            <td>Fiona Green</td> 
            <td>Chief Operating Officer (COO)</td> 
            <td>San Francisco</td> 
            <td>48</td> 
            <td>2010/03/11</td> 
            <td>$850,000</td> 
           </tr> 
           <tr> 
            <td>Shou Itou</td> 
            <td>Regional Marketing</td> 
            <td>Tokyo</td> 
            <td>20</td> 
            <td>2011/08/14</td> 
            <td>$163,000</td> 
           </tr> 
           <tr> 
            <td>Michelle House</td> 
            <td>Integration Specialist</td> 
            <td>Sidney</td> 
            <td>37</td> 
            <td>2011/06/02</td> 
            <td>$95,400</td> 
           </tr> 
           <tr> 
            <td>Suki Burks</td> 
            <td>Developer</td> 
            <td>London</td> 
            <td>53</td> 
            <td>2009/10/22</td> 
            <td>$114,500</td> 
           </tr> 
           <tr> 
            <td>Prescott Bartlett</td> 
            <td>Technical Author</td> 
            <td>London</td> 
            <td>27</td> 
            <td>2011/05/07</td> 
            <td>$145,000</td> 
           </tr> 
           <tr> 
            <td>Gavin Cortez</td> 
            <td>Team Leader</td> 
            <td>San Francisco</td> 
            <td>22</td> 
            <td>2008/10/26</td> 
            <td>$235,500</td> 
           </tr> 
           <tr> 
            <td>Martena Mccray</td> 
            <td>Post-Sales support</td> 
            <td>Edinburgh</td> 
            <td>46</td> 
            <td>2011/03/09</td> 
            <td>$324,050</td> 
           </tr> 
           <tr> 
            <td>Unity Butler</td> 
            <td>Marketing Designer</td> 
            <td>San Francisco</td> 
            <td>47</td> 
            <td>2009/12/09</td> 
            <td>$85,675</td> 
           </tr> 
           <tr> 
            <td>Howard Hatfield</td> 
            <td>Office Manager</td> 
            <td>San Francisco</td> 
            <td>51</td> 
            <td>2008/12/16</td> 
            <td>$164,500</td> 
           </tr> 
           <tr> 
            <td>Hope Fuentes</td> 
            <td>Secretary</td> 
            <td>San Francisco</td> 
            <td>41</td> 
            <td>2010/02/12</td> 
            <td>$109,850</td> 
           </tr> 
           <tr> 
            <td>Vivian Harrell</td> 
            <td>Financial Controller</td> 
            <td>San Francisco</td> 
            <td>62</td> 
            <td>2009/02/14</td> 
            <td>$452,500</td> 
           </tr> 
           <tr> 
            <td>Timothy Mooney</td> 
            <td>Office Manager</td> 
            <td>London</td> 
            <td>37</td> 
            <td>2008/12/11</td> 
            <td>$136,200</td> 
           </tr> 
           <tr> 
            <td>Jackson Bradshaw</td> 
            <td>Director</td> 
            <td>New York</td> 
            <td>65</td> 
            <td>2008/09/26</td> 
            <td>$645,750</td> 
           </tr> 
           <tr> 
            <td>Olivia Liang</td> 
            <td>Support Engineer</td> 
            <td>Singapore</td> 
            <td>64</td> 
            <td>2011/02/03</td> 
            <td>$234,500</td> 
           </tr> 
           <tr> 
            <td>Bruno Nash</td> 
            <td>Software Engineer</td> 
            <td>London</td> 
            <td>38</td> 
            <td>2011/05/03</td> 
            <td>$163,500</td> 
           </tr> 
           <tr> 
            <td>Sakura Yamamoto</td> 
            <td>Support Engineer</td> 
            <td>Tokyo</td> 
            <td>37</td> 
            <td>2009/08/19</td> 
            <td>$139,575</td> 
           </tr> 
           <tr> 
            <td>Thor Walton</td> 
            <td>Developer</td> 
            <td>New York</td> 
            <td>61</td> 
            <td>2013/08/11</td> 
            <td>$98,540</td> 
           </tr> 
           <tr> 
            <td>Finn Camacho</td> 
            <td>Support Engineer</td> 
            <td>San Francisco</td> 
            <td>47</td> 
            <td>2009/07/07</td> 
            <td>$87,500</td> 
           </tr> 
           <tr> 
            <td>Serge Baldwin</td> 
            <td>Data Coordinator</td> 
            <td>Singapore</td> 
            <td>64</td> 
            <td>2012/04/09</td> 
            <td>$138,575</td> 
           </tr> 
           <tr> 
            <td>Zenaida Frank</td> 
            <td>Software Engineer</td> 
            <td>New York</td> 
            <td>63</td> 
            <td>2010/01/04</td> 
            <td>$125,250</td> 
           </tr> 
           <tr> 
            <td>Zorita Serrano</td> 
            <td>Software Engineer</td> 
            <td>San Francisco</td> 
            <td>56</td> 
            <td>2012/06/01</td> 
            <td>$115,000</td> 
           </tr> 
           <tr> 
            <td>Jennifer Acosta</td> 
            <td>Junior Javascript Developer</td> 
            <td>Edinburgh</td> 
            <td>43</td> 
            <td>2013/02/01</td> 
            <td>$75,650</td> 
           </tr> 
           <tr> 
            <td>Cara Stevens</td> 
            <td>Sales Assistant</td> 
            <td>New York</td> 
            <td>46</td> 
            <td>2011/12/06</td> 
            <td>$145,600</td> 
           </tr> 
           <tr> 
            <td>Hermione Butler</td> 
            <td>Regional Director</td> 
            <td>London</td> 
            <td>47</td> 
            <td>2011/03/21</td> 
            <td>$356,250</td> 
           </tr> 
           <tr> 
            <td>Lael Greer</td> 
            <td>Systems Administrator</td> 
            <td>London</td> 
            <td>21</td> 
            <td>2009/02/27</td> 
            <td>$103,500</td> 
           </tr> 
           <tr> 
            <td>Jonas Alexander</td> 
            <td>Developer</td> 
            <td>San Francisco</td> 
            <td>30</td> 
            <td>2010/07/14</td> 
            <td>$86,500</td> 
           </tr> 
           <tr> 
            <td>Shad Decker</td> 
            <td>Regional Director</td> 
            <td>Edinburgh</td> 
            <td>51</td> 
            <td>2008/11/13</td> 
            <td>$183,000</td> 
           </tr> 
           <tr> 
            <td>Michael Bruce</td> 
            <td>Javascript Developer</td> 
            <td>Singapore</td> 
            <td>29</td> 
            <td>2011/06/27</td> 
            <td>$183,000</td> 
           </tr> 
           <tr> 
            <td>Donna Snider</td> 
            <td>Customer Support</td> 
            <td>New York</td> 
            <td>27</td> 
            <td>2011/01/25</td> 
            <td>$112,000</td> 
           </tr> 
          </tbody> 
         </table> 
        </div> 
       </div> 
      </div> 
      <!-- end row --> 
     </div> 
     <!-- container --> 
    </div> 
    <!-- content --> 
    <footer class="footer text-right">
      2017 © Adminox. - Coderthemes.com 
    </footer> 
   </div> 
   <!-- ============================================================== --> 
   <!-- End Right content here --> 
   <!-- ============================================================== --> 
  </div> 
  <!-- END wrapper --> 
  <!-- jQuery  --> 
  <script src="assets/js/jquery.min.js"></script> 
  <script src="assets/js/tether.min.js"></script>
  <!-- Tether for Bootstrap --> 
  <script src="assets/js/bootstrap.min.js"></script> 
  <script src="assets/js/metisMenu.min.js"></script> 
  <script src="assets/js/waves.js"></script> 
  <script src="assets/js/jquery.slimscroll.js"></script> 
  <!-- Required datatable js --> 
  <script src="../plugins/datatables/jquery.dataTables.min.js"></script> 
  <script src="../plugins/datatables/dataTables.bootstrap4.min.js"></script> 
  <!-- Buttons examples --> 
  <script src="../plugins/datatables/dataTables.buttons.min.js"></script> 
  <script src="../plugins/datatables/buttons.bootstrap4.min.js"></script> 
  <script src="../plugins/datatables/jszip.min.js"></script> 
  <script src="../plugins/datatables/pdfmake.min.js"></script> 
  <script src="../plugins/datatables/vfs_fonts.js"></script> 
  <script src="../plugins/datatables/buttons.html5.min.js"></script> 
  <script src="../plugins/datatables/buttons.print.min.js"></script> 
  <script src="../plugins/datatables/buttons.colVis.min.js"></script> 
  <!-- Responsive examples --> 
  <script src="../plugins/datatables/dataTables.responsive.min.js"></script> 
  <script src="../plugins/datatables/responsive.bootstrap4.min.js"></script> 
  <!-- App js --> 
  <script src="assets/js/jquery.core.js"></script> 
  <script src="assets/js/jquery.app.js"></script> 
  <script type="text/javascript">
            $(document).ready(function() {
                $('#datatable').DataTable();

                //Buttons examples
                var table = $('#datatable-buttons').DataTable({
                    lengthChange: false,
                    buttons: ['copy', 'excel', 'pdf', 'colvis']
                });

                table.buttons().container()
                        .appendTo('#datatable-buttons_wrapper .col-md-6:eq(0)');
            } );

        </script>  
 </body>
</html>